<template>
  <div id="app">
    <img alt="Vue logo" src="./assets/logo.png">
    <hr/>
    <HelloWorld msg="aaa"/>
    <hr/>
    <TestVModel/>
    <hr/>
    <TestVOnce/>
    <hr/>
    <TestVPre/>
    <hr/>
    <TestVEvent/>
    <hr/>
    <TestVBind/>
    <hr/>
    <TestVIf/>
    <hr/>
    <TestVFor/>
    <hr/>
    <TestComputed/>
    <hr/>
    <TestWatch/>
    <hr/>
    <TestFilter/>
    <hr/>
    <TestLifeCircle/>
    <hr/>
    <TestArray/>
    <hr/>
    <TestLibary/>
  </div>
</template>

<script>
import HelloWorld from '@/components/HelloWorld.vue'
import TestVModel from "@/components/TestVModel";
import TestVOnce from "@/components/TestVOnce";
import TestVPre from "@/components/TestVPre";
import TestVEvent from "@/components/TestVEvent";
import TestVBind from "@/components/TestVBind";
import TestVIf from "@/components/TestVIf";
import TestVFor from "@/components/TestVFor";
import TestComputed from "@/components/TestComputed";
import TestWatch from "@/components/TestWatch";
import TestFilter from "@/components/TestFilter";
import TestLifeCircle from "@/components/TestLifeCircle";
import TestArray from "@/components/TestArray";
import TestLibary from "@/components/TestLibary";

export default {
  name: 'App',
  components: {
    HelloWorld, TestVModel, TestVOnce, TestVPre, TestVEvent, TestVBind, TestVIf, TestVFor,
    TestComputed, TestWatch, TestFilter, TestLifeCircle, TestArray, TestLibary
  }
}

</script>

<style>
#app {
  font-family: Avenir, Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin-top: 60px;
}
</style>
